<template>
	<view class="c-pages">
		<view class="apply-top" v-if="bset.apply_img" @tap="goto" :data-url="bset.jumpurl">
			<image :src="bset.apply_img" mode="widthFix"></image>
		</view>
		<block v-if="isload">
			<view style="color:#fff;padding:10rpx 30rpx;margin:20rpx 0rpx;" v-if="info.id && info.status == 2">
				审核不通过：{{ info.reason }}，请修改后再提交</view>
			<view style="color:#fff;padding:10rpx 30rpx;margin:20rpx 0rpx;" v-if="info.id && info.status == 0">
				您已提交申请，请等待审核
			</view>
			<form @submit="subform">
				<view class="apply_box">
					<view class="apply_item">
						<view><text style="color:red"> *</text>商家名称</view>
						<view class="flex-y-center"><input type="text" name="name" :value="info.name"
								placeholder="请输入商家名称"></input></view>
					</view>
					<!--<view class="apply_item">
						<view><text style="color:red"> *</text>主营类目</view>
						<view>
							<picker @change="cateChange" :value="cindex" :range="cateArr">
								<view class="picker">{{cateArr[cindex]}}</view>
							</picker>
						</view>
					</view>-->

					<view class="apply_item">
						<view><text style="color:red"> *</text>联系人姓名</view>
						<view class="flex-y-center"><input type="text" name="linkman" :value="info.linkman"
								placeholder="请填写姓名"></input></view>
					</view>

					<view class="apply_item">
						<view><text style="color:red"> *</text>手机号</view>
						<view class="flex-y-center"><input type="text" name="linktel" :value="info.linktel"
								placeholder="请填写手机号码"></input></view>
					</view>
					<view class="apply_item">
						<view><text style="color:red"> *</text>法人代表身份证</view>
						<view class="flex-y-center"><input type="text" name="idcardnumber" :value="idcardnumber"
								placeholder="请输入法人代表身份证"></input></view>
					</view>
					<!--<view class="apply_item">
						<view><text style="color:red"> *</text>验证码</view>
						<view class="flex-y-center"><input type="text" name="code" :value="code" placeholder="请填写验证码"></input></view>
					</view>-->

					<view class="apply_item">
						<view><text style="color:red"> *</text>门店坐标</view>
						<view class="flex-y-center" @tap="locationSelect"><input type="text" disabled
								placeholder="请选择门店坐标" name="zuobiao"
								:value="latitude ? latitude + ',' + longitude : ''"></input></view>
					</view>
					<view class="apply_item">
						<view><text style="color:red"> *</text>门店地址</view>
						<view class="flex-y-center"><input type="text" name="address" :value="address"
								placeholder="请输入门店地址"></input></view>
					</view>
					<input type="text" hidden="true" style="position: fixed;left: -200%;" name="latitude"
						:value="latitude"></input>
					<input type="text" hidden="true" style="position: fixed;left: -200%;" name="longitude"
						:value="longitude"></input>

					<view class="apply_item" style="border-bottom:0"><text><text style="color:red">
								*</text>商家logo</text></view>
					<view class="flex" style="flex-wrap:wrap;padding-bottom:20rpx;">
						<view v-for="(item, index) in pic" :key="index" class="layui-imgbox">
							<view class="layui-imgbox-close" @tap="removeimg" :data-index="index" data-field="pic">
								<image src="/static/img/ico-del.png"></image>
							</view>
							<view class="layui-imgbox-img">
								<image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image>
							</view>
						</view>
						<view class="uploadbtn"
							:style="'background:url(' + static_url + '/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'"
							@tap="uploadimg" data-field="pic" v-if="pic.length == 0"></view>
					</view>
					<input type="text" hidden="true" name="pic" :value="pic.join(',')" maxlength="-1"></input>

					<view class="apply_item" style="border-bottom:0"><text><text style="color:red">
								*</text>商家照片(3-5张)</text></view>
					<view class="flex" style="flex-wrap:wrap;padding-bottom:20rpx;">
						<view v-for="(item, index) in pics" :key="index" class="layui-imgbox">
							<view class="layui-imgbox-close" @tap="removeimg" :data-index="index" data-field="pics">
								<image src="/static/img/ico-del.png"></image>
							</view>
							<view class="layui-imgbox-img">
								<image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image>
							</view>
						</view>
						<view class="uploadbtn"
							:style="'background:url(' + static_url + '/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'"
							@tap="uploadimg" data-field="pics" v-if="pics.length < 5"></view>
					</view>
					<input type="text" hidden="true" name="pics" :value="pics.join(',')" maxlength="-1"></input>

					<view class="apply_item" style="border-bottom:0"><text><text style="color:red"> *</text>营业执照</text>
					</view>
					<view class="flex" style="flex-wrap:wrap;padding-bottom:20rpx;">
						<view v-for="(item, index) in zhengming" :key="index" class="layui-imgbox">
							<view class="layui-imgbox-close" @tap="removeimg" :data-index="index"
								data-field="zhengming">
								<image src="/static/img/ico-del.png"></image>
							</view>
							<view class="layui-imgbox-img">
								<image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image>
							</view>
						</view>
						<view class="uploadbtn"
							:style="'background:url(' + static_url + '/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'"
							@tap="uploadimg" data-field="zhengming"></view>
					</view>
					<input type="text" hidden="true" name="zhengming" :value="zhengming.join(',')"
						maxlength="-1"></input>

					<view class="apply_item" style="border-bottom:0"><text><text style="color:red">
								*</text>银行开户许可证</text></view>
					<view class="flex" style="flex-wrap:wrap;padding-bottom:20rpx;">
						<view v-for="(item, index) in bank_img" :key="index" class="layui-imgbox">
							<view class="layui-imgbox-close" @tap="removeimg" :data-index="index" data-field="bank_img">
								<image src="/static/img/ico-del.png"></image>
							</view>
							<view class="layui-imgbox-img">
								<image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image>
							</view>
						</view>
						<view class="uploadbtn"
							:style="'background:url(' + static_url + '/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'"
							@tap="uploadimg" data-field="bank_img" v-if="bank_img.length == 0"></view>
					</view>
					<input type="text" hidden="true" name="bank_img" :value="bank_img.join(',')" maxlength="-1"></input>

					<view class="apply_item" style="border-bottom:0"><text><text style="color:red">
								*</text>相关经营范围的许可证</text></view>
					<view class="flex" style="flex-wrap:wrap;padding-bottom:20rpx;">
						<view v-for="(item, index) in jingying_img" :key="index" class="layui-imgbox">
							<view class="layui-imgbox-close" @tap="removeimg" :data-index="index"
								data-field="jingying_img">
								<image src="/static/img/ico-del.png"></image>
							</view>
							<view class="layui-imgbox-img">
								<image :src="item" @tap="previewImage" :data-url="item" mode="widthFix"></image>
							</view>
						</view>
						<view class="uploadbtn"
							:style="'background:url(' + static_url + '/static/img/shaitu_icon.png) no-repeat 60rpx;background-size:80rpx 80rpx;background-color:#F3F3F3;'"
							@tap="uploadimg" data-field="jingying_img" v-if="jingying_img.length == 0"></view>
					</view>
					<input type="text" hidden="true" name="jingying_img" :value="jingying_img.join(',')"
						maxlength="-1"></input>

					<view class="apply_item">
						<text><text style="color:red"> *</text>登录账号</text>
						<view class="flex-y-center"><input type="text" name="un" :value="info.un" placeholder="请填写登录账号"
								autocomplete="off"></input></view>
					</view>
					<view class="apply_item">
						<text><text style="color:red"> *</text>登录密码</text>
						<view class="flex-y-center"><input type="password" name="pwd" :value="info.pwd"
								placeholder="请填写登录密码" autocomplete="off"></input></view>
					</view>
					<view class="apply_item">
						<text><text style="color:red"> *</text>确认密码</text>
						<view class="flex-y-center"><input type="password" name="repwd" :value="info.repwd"
								placeholder="请再次填写密码"></input></view>
					</view>

					<view class="form-box">
						<view class="form-item flex-col">
							<text>商家简介</text>
							<view class="detailop">
								<view class="btn" @tap="detailAddtxt">+文本</view>
								<view class="btn" @tap="detailAddpic">+图片</view>
								<!--<view class="btn" @tap="detailAddvideo">+视频</view>-->
							</view>
							<view>
								<block v-for="(setData, index) in pagecontent" :key="index">
									<view class="detaildp">
										<view class="op">
											<view class="flex1"></view>
											<view class="btn" @tap="detailMoveup" :data-index="index">上移</view>
											<view class="btn" @tap="detailMovedown" :data-index="index">下移</view>
											<view class="btn" @tap="detailMovedel" :data-index="index">删除</view>
										</view>
										<view class="detailbox">
											<block v-if="setData.temp == 'notice'">
												<dp-notice :params="setData.params" :data="setData.data"></dp-notice>
											</block>
											<block v-if="setData.temp == 'banner'">
												<dp-banner :params="setData.params" :data="setData.data"></dp-banner>
											</block>
											<block v-if="setData.temp == 'search'">
												<dp-search :params="setData.params" :data="setData.data"></dp-search>
											</block>
											<block v-if="setData.temp == 'text'">
												<dp-text :params="setData.params" :data="setData.data"></dp-text>
											</block>
											<block v-if="setData.temp == 'title'">
												<dp-title :params="setData.params" :data="setData.data"></dp-title>
											</block>
											<block v-if="setData.temp == 'dhlist'">
												<dp-dhlist :params="setData.params" :data="setData.data"></dp-dhlist>
											</block>
											<block v-if="setData.temp == 'line'">
												<dp-line :params="setData.params" :data="setData.data"></dp-line>
											</block>
											<block v-if="setData.temp == 'blank'">
												<dp-blank :params="setData.params" :data="setData.data"></dp-blank>
											</block>
											<block v-if="setData.temp == 'menu'">
												<dp-menu :params="setData.params" :data="setData.data"></dp-menu>
											</block>
											<block v-if="setData.temp == 'map'">
												<dp-map :params="setData.params" :data="setData.data"></dp-map>
											</block>
											<block v-if="setData.temp == 'cube'">
												<dp-cube :params="setData.params" :data="setData.data"></dp-cube>
											</block>
											<block v-if="setData.temp == 'picture'">
												<dp-picture :params="setData.params" :data="setData.data"></dp-picture>
											</block>
											<block v-if="setData.temp == 'pictures'">
												<dp-pictures :params="setData.params"
													:data="setData.data"></dp-pictures>
											</block>
											<block v-if="setData.temp == 'video'">
												<dp-video :params="setData.params" :data="setData.data"></dp-video>
											</block>
											<block v-if="setData.temp == 'shop'">
												<dp-shop :params="setData.params" :data="setData.data"
													:shopinfo="setData.shopinfo"></dp-shop>
											</block>
											<block v-if="setData.temp == 'product'">
												<dp-product :params="setData.params" :data="setData.data"
													:menuindex="menuindex"></dp-product>
											</block>

											<block v-if="setData.temp == 'seckill'">
												<dp-seckill :params="setData.params" :data="setData.data"></dp-seckill>
											</block>
											<block v-if="setData.temp == 'scoreshop'">
												<dp-scoreshop :params="setData.params"
													:data="setData.data"></dp-scoreshop>
											</block>
											<block v-if="setData.temp == 'article'">
												<dp-article :params="setData.params" :data="setData.data"></dp-article>
											</block>
											<block v-if="setData.temp == 'button'">
												<dp-button :params="setData.params" :data="setData.data"></dp-button>
											</block>
											<block v-if="setData.temp == 'cover'">
												<dp-cover :params="setData.params" :data="setData.data"></dp-cover>
											</block>
											<block v-if="setData.temp == 'richtext'">
												<dp-richtext :params="setData.params" :data="setData.data"
													:content="setData.content"></dp-richtext>
											</block>
											<block v-if="setData.temp == 'userinfo'">
												<dp-userinfo :params="setData.params" :data="setData.data"
													:content="setData.content"></dp-userinfo>
											</block>
										</view>
									</view>
								</block>
							</view>
						</view>
					</view>

					<block v-if="bset.xieyi_show == 1">
						<view class="flex-y-center" style="margin-left:20rpx;color:#999"
							v-if="!info.id || info.status == 2">
							<checkbox-group @change="isagreeChange"><label class="flex-y-center">
									<checkbox value="1" :checked="isagree"></checkbox>已阅读并同意
								</label></checkbox-group>
							<text style="color:#666" @tap="showxieyiFun">《入驻协议》</text>
						</view>
					</block>
					<view style="padding:30rpx 0"><button v-if="!info.id || info.status == 2" form-type="submit"
							class="set-btn" :style="'background:' + t('color1') + ' '">提交申请</button>
					</view>

				</view>
			</form>

			<view id="xieyi" :hidden="!showxieyi"
				style="width:100%;height:100%;position:fixed;top:0;left:0;z-index:99;background:rgba(0,0,0,0.7)">
				<view
					style="width:90%;margin:0 auto;height:85%;margin-top:10%;background:#fff;color:#333;padding:5px 10px 50px 10px;position:relative;border-radius:2px">
					<view style="overflow:scroll;height:100%;">
						<parse :content="bset.xieyi" />
					</view>
					<view
						style="position:absolute;z-index:9999;bottom:10px;left:0;right:0;margin:0 auto;text-align:center"
						@tap="hidexieyi">已阅读并同意</view>
				</view>
			</view>

			<view class="popup__container" v-if="clistshow">
				<view class="popup__overlay" @tap.stop="changeClistDialog"></view>
				<view class="popup__modal">
					<view class="popup__title">
						<text class="popup__title-text">请选择主营类目</text>
						<image src="/static/img/close.png" class="popup__close" style="width:36rpx;height:36rpx"
							@tap.stop="changeClistDialog" />
					</view>
					<view class="popup__content">
						<block v-for="(item, index) in clist" :key="item.id">
							<view class="clist-item" @tap="cidsChange" :data-id="item.id">
								<view class="flex1">{{ item.name }}</view>
								<view class="radio"
									:style="inArray(item.id, cids) ? 'background:' + t('color1') + ';border:0' : ''">
									<image class="radio-img" src="/static/img/checkd.png" />
								</view>
							</view>
							<block v-for="(item2, index2) in item.child" :key="item2.id">
								<view class="clist-item" style="padding-left:80rpx" @tap="cidsChange"
									:data-id="item2.id">
									<view class="flex1" v-if="item.child.length - 1 == index2">└ {{ item2.name }}</view>
									<view class="flex1" v-else>├ {{ item2.name }}</view>
									<view class="radio"
										:style="inArray(item2.id, cids) ? 'background:' + t('color1') + ';border:0' : ''">
										<image class="radio-img" src="/static/img/checkd.png" />
									</view>
								</view>
								<block v-for="(item3, index3) in item2.child" :key="item3.id">
									<view class="clist-item" style="padding-left:160rpx" @tap="cidsChange"
										:data-id="item3.id">
										<view class="flex1" v-if="item2.child.length - 1 == index3">└ {{ item3.name }}
										</view>
										<view class="flex1" v-else>├ {{ item3.name }}</view>
										<view class="radio"
											:style="inArray(item3.id, cids) ? 'background:' + t('color1') + ';border:0' : ''">
											<image class="radio-img" src="/static/img/checkd.png" />
										</view>
									</view>
								</block>
							</block>
						</block>
					</view>
				</view>
			</view>

			<uni-popup id="dialogDetailtxt" ref="dialogDetailtxt" type="dialog">
				<view class="uni-popup-dialog">
					<view class="uni-dialog-title">
						<text class="uni-dialog-title-text">请输入文本内容</text>
					</view>
					<view class="uni-dialog-content">
						<textarea value="" placeholder="请输入文本内容" @input="catcheDetailtxt"></textarea>
					</view>
					<view class="uni-dialog-button-group">
						<view class="uni-dialog-button" @click="dialogDetailtxtClose">
							<text class="uni-dialog-button-text">取消</text>
						</view>
						<view class="uni-dialog-button uni-border-left" @click="dialogDetailtxtConfirm">
							<text class="uni-dialog-button-text uni-button-color">确定</text>
						</view>
					</view>
					<view class="uni-popup-dialog__close" @click="dialogDetailtxtClose">
						<span class="uni-popup-dialog__close-icon "></span>
					</view>
				</view>
			</uni-popup>
		</block>
		<loading v-if="loading"></loading>
		<dp-tabbar :opt="opt"></dp-tabbar>
		<popmsg ref="popmsg"></popmsg>
	</view>
</template>

<script>
var app = getApp();

export default {
	data() {
		return {
			opt: {},
			loading: false,
			isload: false,
			menuindex: -1,

			pre_url: app.globalData.pre_url, static_url: app.globalData.static_url,
			datalist: [],
			pagenum: 1,
			cids: [],
			cateArr: [],
			cindex: 0,
			cnames: '',
			isagree: false,
			showxieyi: false,
			pic: [],
			jingying_img: [],
			bank_img: [],
			pics: [],
			zhengming: [],
			info: {},
			bset: {},
			latitude: '',
			longitude: '',
			address: '',
			code: '',
			pagecontent: [],

			clistshow: false,
			idcardnumber: '',

		};
	},

	onLoad: function (opt) {
		this.opt = app.getopts(opt);
		this.getdata();
	},
	onPullDownRefresh: function () {
		this.getdata();
	},
	methods: {
		getdata: function () {
			var that = this;
			that.loading = true;
			app.get('Business/apply', {}, function (res) {
				that.loading = false;
				if (res.status == 2) {
					app.alert(res.msg, function () {
						app.goto('/admin/index/index', 'redirect');
					})
					return;
				}
				uni.setNavigationBarTitle({
					title: res.title
				});
				var clist = res.clist;
				/*var cateArr = [];
				for (var i in clist) {
					cateArr.push(clist[i].name);
				}*/
				var pics = res.info ? res.info.pics : '';
				if (pics) {
					pics = pics.split(',');
				} else {
					pics = [];
				}
				var zhengming = res.info ? res.info.zhengming : '';
				if (zhengming) {
					zhengming = zhengming.split(',');
				} else {
					zhengming = [];
				}
				that.clist = res.clist
				that.cateArr = res.cateArr
				that.bset = res.bset
				that.info = res.info
				that.address = res.info.address;
				that.idcardnumber = res.info.idcardnumber;
				that.latitude = res.info.latitude;
				that.longitude = res.info.longitude;
				//that.cateArr = cateArr;
				that.pic = res.info.pic ? [res.info.pic] : [];
				that.jingying_img = res.info.jingying_img ? [res.info.jingying_img] : [];
				that.bank_img = res.info.bank_img ? [res.info.bank_img] : [];
				that.pics = pics;
				that.zhengming = zhengming;
				that.loaded();
			});
		},
		cateChange: function (e) {
			this.cindex = e.detail.value;
		},
		changeClistDialog: function () {
			this.clistshow = !this.clistshow
		},
		cidsChange: function (e) {
			var clist = this.clist;
			var cids = this.cids;
			var cid = e.currentTarget.dataset.id;
			var newcids = [];
			var ischecked = false;
			if (cids.includes(cid)) {
				newcids = [];
			} else {
				newcids.push(cid)
			}

			this.cids = newcids;
			this.getcnames();
		},
		getcnames: function () {
			var cateArr = this.cateArr;
			var cids = this.cids;
			var cnames = [];
			for (var i in cids) {
				cnames.push(cateArr[cids[i]]);
			}
			this.cnames = cnames.join(',');
		},
		locationSelect: function () {
			var that = this;
			uni.chooseLocation({
				success: function (res) {
					that.info.address = res.name;
					that.info.latitude = res.latitude;
					that.info.longitude = res.longitude;
					that.address = res.name;
					that.latitude = res.latitude;
					that.longitude = res.longitude;
				},
				fail(e) {
					console.log(e, 888);
				}
			});
		},
		subform: function (e) {
			var that = this;
			var info = e.detail.value;
			if (info.name == '') {
				app.error('请填写商家名称');
				return false;
			}
			if (info.linkman == '') {
				app.error('请填写联系人姓名');
				return false;
			}
			if (info.linktel == '') {
				app.error('请填写手机号');
				return false;
			}
			if (!/(^0?1[3|4|5|6|7|8|9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9]$)/.test(info.linktel)) {
				app.error('请填写正确手机号');
				return false;
			}
			if (info.zuobiao == '') {
				//app.error('请选择店铺坐标');
				//return false;
			}
			if (info.address == '') {
				app.error('请填写门店地址');
				return false;
			}
			if (info.idcardnumber == '') {
				app.error('请填写法人代表身份证');
				return false;
			}
			if (info.pic == '') {
				app.error('请上传商家主图');
				return false;
			}
			if (info.pics == '') {
				app.error('请上传商家照片');
				return false;
			}
			if (info.zhengming == '') {
				app.error('请上传营业执照');
				return false;
			}
			if (info.un == '') {
				app.error('请填写登录账号');
				return false;
			}
			if (info.pwd == '') {
				app.error('请填写登录密码');
				return false;
			}
			var pwd = info.pwd;
			if (pwd.length < 6) {
				app.error('密码不能小于6位');
				return false;
			}
			if (info.repwd != info.pwd) {
				app.error('两次输入密码不一致');
				return false;
			}
			info.address = that.address;
			info.latitude = that.latitude;
			info.longitude = that.longitude;

			info.drinking_conditions = that.info.drinking_conditions

			if (that.bset.xieyi_show == 1 && !that.isagree) {
				app.error('请先阅读并同意商户入驻协议');
				return false;
			}
			//info.cid = that.clist[that.cindex].id;
			info.cid = that.cids.join(',')
			if (that.info && that.info.id) {
				info.id = that.info.id;
			}
			app.showLoading('提交中');
			app.post("Business/apply", {
				info: info,
				pagecontent: that.pagecontent,
			}, function (res) {
				app.showLoading(false);
				app.error(res.msg);
				if (res.status == 1) {
					setTimeout(function () {
						app.goto(app.globalData.indexurl);
					}, 1000);
				}
			});
		},
		isagreeChange: function (e) {
			console.log(e.detail.value);
			var val = e.detail.value;
			if (val.length > 0) {
				this.isagree = true;
			} else {
				this.isagree = false;
			}
		},
		showxieyiFun: function () {
			this.showxieyi = true;
		},
		hidexieyi: function () {
			this.showxieyi = false;
			this.isagree = true;
		},
		uploadimg: function (e) {
			var that = this;
			var field = e.currentTarget.dataset.field
			var pics = that[field]
			if (!pics) pics = [];
			app.chooseImage(function (urls) {
				for (var i = 0; i < urls.length; i++) {
					pics.push(urls[i]);
				}
				if (field == 'pic') that.pic = pics;
				if (field == 'pics') that.pics = pics;
				if (field == 'zhengming') that.zhengming = pics;
				if (field == 'jingying_img') that.jingying_img = pics;
				if (field == 'bank_img') that.bank_img = pics;
			}, 1)
		},
		removeimg: function (e) {
			var that = this;
			var index = e.currentTarget.dataset.index
			var field = e.currentTarget.dataset.field
			if (field == 'pic') {
				var pics = that.pic
				pics.splice(index, 1);
				that.pic = pics;
			} else if (field == 'pics') {
				var pics = that.pics
				pics.splice(index, 1);
				that.pics = pics;
			} else if (field == 'zhengming') {
				var pics = that.zhengming
				pics.splice(index, 1);
				that.zhengming = pics;
			} else if (field == 'jingying_img') {
				var pics = that.jingying_img
				pics.splice(index, 1);
				that.jingying_img = pics;
			} else if (field == 'bank_img') {
				var pics = that.bank_img
				pics.splice(index, 1);
				that.bank_img = pics;
			}
		},

		detailAddtxt: function () {
			this.$refs.dialogDetailtxt.open();
		},
		dialogDetailtxtClose: function () {
			this.$refs.dialogDetailtxt.close();
		},
		catcheDetailtxt: function (e) {
			console.log(e)
			this.catche_detailtxt = e.detail.value;
		},
		dialogDetailtxtConfirm: function (e) {
			var detailtxt = this.catche_detailtxt;
			console.log(detailtxt)
			var Mid = 'M' + new Date().getTime() + parseInt(Math.random() * 1000000);
			var pagecontent = this.pagecontent;
			pagecontent.push({
				"id": Mid,
				"temp": "text",
				"params": {
					"content": detailtxt,
					"showcontent": detailtxt,
					"bgcolor": "#ffffff",
					"fontsize": "14",
					"lineheight": "20",
					"letter_spacing": "0",
					"bgpic": "",
					"align": "left",
					"color": "#000",
					"margin_x": "0",
					"margin_y": "0",
					"padding_x": "5",
					"padding_y": "5",
					"quanxian": {
						"all": true
					},
					"platform": {
						"all": true
					}
				},
				"data": "",
				"other": "",
				"content": ""
			});
			this.pagecontent = pagecontent;
			this.$refs.dialogDetailtxt.close();
		},
		detailAddpic: function () {
			var that = this;
			app.chooseImage(function (urls) {
				var Mid = 'M' + new Date().getTime() + parseInt(Math.random() * 1000000);
				var pics = [];
				for (var i in urls) {
					var picid = 'p' + new Date().getTime() + parseInt(Math.random() * 1000000);
					pics.push({
						"id": picid,
						"imgurl": urls[i],
						"hrefurl": "",
						"option": "0"
					})
				}
				var pagecontent = that.pagecontent;
				pagecontent.push({
					"id": Mid,
					"temp": "picture",
					"params": {
						"bgcolor": "#FFFFFF",
						"margin_x": "0",
						"margin_y": "0",
						"padding_x": "0",
						"padding_y": "0",
						"quanxian": {
							"all": true
						},
						"platform": {
							"all": true
						}
					},
					"data": pics,
					"other": "",
					"content": ""
				});
				that.pagecontent = pagecontent;
			}, 9);
		},
		detailAddvideo: function () {
			var that = this;
			uni.chooseVideo({
				sourceType: ['album', 'camera'],
				success: function (res) {
					var tempFilePath = res.tempFilePath;
					app.showLoading('上传中');
					uni.uploadFile({
						url: app.globalData.baseurl + 'ApiImageupload/uploadImg/aid/' + app
							.globalData.aid + '/platform/' + app.globalData.platform +
							'/session_id/' + app.globalData.session_id,
						filePath: tempFilePath,
						name: 'file',
						success: function (res) {
							app.showLoading(false);
							var data = JSON.parse(res.data);
							if (data.status == 1) {
								that.video = data.url;
								var pagecontent = that.pagecontent;
								var Mid = 'M' + new Date().getTime() + parseInt(Math
									.random() * 1000000);
								pagecontent.push({
									"id": Mid,
									"temp": "video",
									"params": {
										"bgcolor": "#FFFFFF",
										"margin_x": "0",
										"margin_y": "0",
										"padding_x": "0",
										"padding_y": "0",
										"src": data.url,
										"quanxian": {
											"all": true
										},
										"platform": {
											"all": true
										}
									},
									"data": "",
									"other": "",
									"content": ""
								});
								that.pagecontent = pagecontent;
							} else {
								app.alert(data.msg);
							}
						},
						fail: function (res) {
							app.showLoading(false);
							app.alert(res.errMsg);
						}
					});
				},
				fail: function (res) {
					console.log(res); //alert(res.errMsg);
				}
			});
		},
		detailMoveup: function (e) {
			var index = e.currentTarget.dataset.index;
			var pagecontent = this.pagecontent;
			if (index > 0)
				pagecontent[index] = pagecontent.splice(index - 1, 1, pagecontent[index])[0];
		},
		detailMovedown: function (e) {
			var index = e.currentTarget.dataset.index;
			var pagecontent = this.pagecontent;
			if (index < pagecontent.length - 1)
				pagecontent[index] = pagecontent.splice(index + 1, 1, pagecontent[index])[0];
		},
		detailMovedel: function (e) {
			var index = e.currentTarget.dataset.index;
			var pagecontent = this.pagecontent;
			pagecontent.splice(index, 1);
		},
		setDrinking: function (e, index) {
			var money = e.detail.value;
			this.info.drinking_conditions[index].money = money
			console.log(this.info.drinking_conditions);
		},
		setDrinkingnumber: function (e, index) {
			var number = e.detail.value;
			this.info.drinking_conditions[index].number = number
			console.log(this.info.drinking_conditions);
		},
	}
}
</script>
<style>
radio {
	transform: scale(0.6);
}

checkbox {
	transform: scale(0.6);
}

.c-pages {
	background: linear-gradient(90deg, #ffa374 0%, #ff688b 100%);
}

.apply-top {}

.apply-top image {
	width: 100%;
}

.apply_box {
	padding: 2rpx 24rpx 0 24rpx;
	background: #fff;
	margin: 0rpx 24rpx;
	border-radius: 10rpx
}

.apply_title {
	background: #fff
}

.apply_title .qr_goback {
	width: 18rpx;
	height: 32rpx;
	margin-left: 24rpx;
	margin-top: 34rpx;
}

.apply_title .qr_title {
	font-size: 36rpx;
	color: #242424;
	font-weight: bold;
	margin: 0 auto;
	line-height: 100rpx;
}

.apply_item {
	line-height: 100rpx;
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid #eee
}

.apply_box .apply_item:last-child {
	border: none
}

.apply_item input {
	width: 100%;
	border: none;
	color: #111;
	font-size: 28rpx;
	text-align: right
}

.apply_item input::placeholder {
	color: #999999
}

.apply_item textarea {
	width: 100%;
	min-height: 200rpx;
	padding: 20rpx 0;
	border: none;
}

.apply_item .upload_pic {
	margin: 50rpx 0;
	background: #F3F3F3;
	width: 90rpx;
	height: 90rpx;
	text-align: center
}

.apply_item .upload_pic image {
	width: 32rpx;
	height: 32rpx;
}

.set-btn {
	width: 90%;
	margin: 0 5%;
	height: 96rpx;
	line-height: 96rpx;
	border-radius: 48rpx;
	color: #FFFFFF;
	font-weight: bold;
}

.layui-imgbox {
	margin-right: 16rpx;
	margin-bottom: 10rpx;
	font-size: 24rpx;
	position: relative;
}

.layui-imgbox-close {
	position: absolute;
	display: block;
	width: 32rpx;
	height: 32rpx;
	right: -16rpx;
	top: -16rpx;
	z-index: 90;
	color: #999;
	font-size: 32rpx;
	background: #fff
}

.layui-imgbox-close image {
	width: 100%;
	height: 100%
}

.layui-imgbox-img {
	display: block;
	width: 200rpx;
	height: 200rpx;
	padding: 2px;
	border: #d3d3d3 1px solid;
	background-color: #f6f6f6;
	overflow: hidden
}

.layui-imgbox-img>image {
	max-width: 100%;
}

.layui-imgbox-repeat {
	position: absolute;
	display: block;
	width: 32rpx;
	height: 32rpx;
	line-height: 28rpx;
	right: 2px;
	bottom: 2px;
	color: #999;
	font-size: 30rpx;
	background: #fff
}

.uploadbtn {
	position: relative;
	height: 200rpx;
	width: 200rpx
}

.form-box {
	background: #fff;
	border-radius: 10rpx
}

.form-item {
	line-height: 100rpx;
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid #eee
}

.form-item .f1 {
	color: #222;
	width: 200rpx;
	flex-shrink: 0
}

.form-item .f2 {
	display: flex;
	align-items: center
}

.form-box .form-item:last-child {
	border: none
}

.form-box .flex-col {
	padding-bottom: 20rpx
}

.detailop {
	display: flex;
	line-height: 60rpx
}

.detailop .btn {
	border: 1px solid #ccc;
	margin-right: 10rpx;
	padding: 0 16rpx;
	color: #222;
	border-radius: 10rpx
}

.detaildp {
	position: relative;
	line-height: 50rpx
}

.detaildp .op {
	width: 100%;
	display: flex;
	justify-content: flex-end;
	font-size: 24rpx;
	height: 60rpx;
	line-height: 60rpx;
	margin-top: 10rpx
}

.detaildp .op .btn {
	background: rgba(0, 0, 0, 0.4);
	margin-right: 10rpx;
	padding: 0 10rpx;
	color: #fff
}

.detaildp .detailbox {
	border: 2px dashed #00a0e9
}

.uni-popup-dialog {
	width: 300px;
	border-radius: 5px;
	background-color: #fff;
}

.uni-dialog-title {
	display: flex;
	flex-direction: row;
	justify-content: center;
	padding-top: 15px;
	padding-bottom: 5px;
}

.uni-dialog-title-text {
	font-size: 16px;
	font-weight: 500;
}

.uni-dialog-content {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding: 5px 15px 15px 15px;
}

.uni-dialog-content-text {
	font-size: 14px;
	color: #6e6e6e;
}

.uni-dialog-button-group {
	display: flex;
	flex-direction: row;
	border-top-color: #f5f5f5;
	border-top-style: solid;
	border-top-width: 1px;
}

.uni-dialog-button {
	display: flex;
	flex: 1;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	height: 45px;
}

.uni-border-left {
	border-left-color: #f0f0f0;
	border-left-style: solid;
	border-left-width: 1px;
}

.uni-dialog-button-text {
	font-size: 14px;
}

.uni-button-color {
	color: #007aff;
}


.drinking-item {
	display: flex;
	margin: 20rpx 0rpx;
}

.drinking-item input {
	border: 2rpx solid #f2f2f2;
	box-sizing: border-box;
	height: 66rpx;
	line-height: 66rpx;
	padding-left: 12rpx;
}

.drinking_conditions {
	padding-bottom: 24rpx;
}

.clist-item {
	display: flex;
	border-bottom: 1px solid #f5f5f5;
	padding: 20rpx 30rpx;
}

.radio {
	flex-shrink: 0;
	width: 32rpx;
	height: 32rpx;
	background: #FFFFFF;
	border: 2rpx solid #BFBFBF;
	border-radius: 50%;
	margin-right: 30rpx
}

.radio .radio-img {
	width: 100%;
	height: 100%;
	display: block
}

.popup__container {
	z-index: 1000;
}
</style>